<template>
  <fieldset>
    <legend>axios使用</legend>
    <button @click="get">点击发送get请求</button>
    <button @click="post">点击发送post请求</button>
  </fieldset>
</template>

<script>
    import axios from "axios"
    export default {
        methods: {
            get(){
                //1.第一种方式
                // axios.get("/api/data/index.json",{
                //     params:{  //给get请求传递参数
                //         name:"李雷"
                //     }
                // })
                // .then(res=>{
                //     console.log(res);
                // })

                //2.config模式
                // axios({
                //     url:"/api/data/index.json",
                //     method:"get",   //请求方式
                //     params:{
                //         name:"lbw"  //这样打开网页的network就可以看到lbw拼接到地址上了
                //     },
                // })
                // .then(res=>{
                //     console.log(res);
                // })
            },
            post(){
                //1.第一种方法
                //     第一个参数是请求地址，第二个参数是请求体，第三个参数是配置项
                // axios.post("/api/users/login",{
                //     username:"lbw",
                //     password:"555",
                // },{
                //     headers:{
                //         "content-type": "application/json"
                //     }
                // }
                // )
                // .then(res=>{
                //     console.log(res);
                // })

                //2.config模式
                axios({
                    url:"/api/users/login",
                    //post请求要放在data中
                    data:{
                        username:"lbw",
                        password:"555",
                    },
                    //get请求放在params中
                    headers:{
                        "content-type": "application/json"
                    },
                    method:"POST"
                })
                .then(res=>{
                    console.log(res);
                })


            }
        }
    }
</script>

<style>

</style>